<template>
  <div class="home">
    <user></user>
    <div class="swipe-box">
      <van-swipe class="home__swipe" :loop="true">
        <van-swipe-item
          ><img
            class="item_img"
            src="https://poly-data-center.oss-cn-shenzhen.aliyuncs.com/customer-service-admin/problem-3446347d-b7a9-47ad-bfe2-5751701c923d.png"
        /></van-swipe-item>
        <van-swipe-item
          ><img
            class="item_img"
            src="https://poly-data-center.oss-cn-shenzhen.aliyuncs.com/customer-service-admin/problem-e0412a61-f371-4abb-8570-486be7b60f39.png"
        /></van-swipe-item>
      </van-swipe>
    </div>
  </div>
</template>

<script>
import { onMounted } from 'vue'
import { Swipe, SwipeItem } from 'vant'
import user from './components/user'
import { getUserInfo } from './../../api/home'
export default {
  name: "Home",
  components: { user, [Swipe.name]: Swipe, [SwipeItem.name]: SwipeItem },
  setup () {
    async function getList () {
      let { data } = await getUserInfo({})
      console.log(data, 'data')
    }
    onMounted(() => {
      getList()
    })
  }
};
</script>
<style lang='less' scoped>
.home {
  .swipe-box {
    width: 100vw;
    padding: 0 2vw;
    box-sizing: border-box;
    .home__swipe {
      width: 96vw;
      height: 150px;
      .item_img {
        width: 100%;
        height: 100%;
      }
    }
  }
}
</style>
